<ol class="breadcrumb">
    <li><a href="#">奇妙云箱</a></li>
    <li>移动内容管理</li>
</ol>
<div class="panel panel-default">
    <div class="panel-heading">
        <span class="icon-picture icon-large"></span>
        <span class="panel-title">第一步：选择广告图片</span>
    </div>
    <div class="panel-body">
        <% if(session.permissionMap[1016]){ %>
        <a class="btn btn-default btn-sm" onclick="checkAll('imgschk')" name="checkAll">全选</a>
        <a class="btn btn-default btn-sm" onclick="reverseSelect('imgschk')">取消全选</a>
        <a class="btn btn-danger btn-sm" onclick="doRemove()">删除选择</a>
        <% } %>
        <% if(session.permissionMap[1015]){ %>
        <a href="/material/add" class="upload pull-right btn btn-success btn-sm">
            <span class="icon-upload-alt"></span>
            <span>上传图片</span>
        </a>
        <% } %>
    </div>
    <div class="panel-body">
        <% if(arr){arr.forEach(function(imgurl, index){ %>
        <a class="thumbnail pull-left col-xs-1" href="javascript:void(0);" onclick="checkthis(this)">
            <img src="<%= domain + imgurl %>?imageView2/1/w/100/h/100">
            <input type="checkbox" name="imgschk" value="<%= imgurl %>">
        </a>
        <% })} %>
    </div>
</div>
<div class="panel panel-default">
    <div class="panel-heading">
        <span class="icon-mobile-phone icon-large"></span>
        <span class="panel-title">第二步：选择箱子订阅号</span>
    </div>
    <div class="panel-body">
        <a class="btn btn-default btn-sm" name="checkAll" onclick="checkAll('simschk')">全选</a>
        <a class="btn btn-default btn-sm" onclick="reverseSelect('simschk')">取消全选</a>
    </div>
    <div class="panel-body">
        <% sims.forEach(function(sim, index){ %>
        <div class="input-group col-xs-1 pull-left phonenumber">
          <span class="input-group-addon">
            <input type="checkbox" name="simschk" value="<%= sim._id %>" id="<%= sim._id %>">
          </span>
            <label class="form-control" for="<%= sim._id %>"><%= sim.sim %></label>
        </div>
        <!--<div class="col-xs-1 ">-->
        <!--<input type="checkbox" name="simschk" value="<%= sim._id %>" id="<%= sim._id %>">-->
        <!--<label for="<%= sim._id %>"><%= sim.sim %></label>-->
        <!--</div>-->
        <% }) %>
    </div>
</div>
<% if(session.permissionMap[1017]){ %>
<div class="col-sm-offset-4 col-sm-4" style="margin-top: 15px;margin-bottom: 20px;">
    <button type="button" class="btn btn-success btn-block" onclick="updateSim()">提交(设置摇一摇广告)</button>
</div>
<% } %>
<script type="text/javascript">
    $(function () {


        $('[name="imgschk"]').click(function(event){
            event.stopPropagation();
        });

//获得浏览器参数
        $.extend({
            getUrlVars: function () {
                var vars = [], hash;
                var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
                for (var i = 0; i < hashes.length; i++) {
                    hash = hashes[i].split('=');
                    vars.push(hash[0]);
                    vars[hash[0]] = hash[1];
                }
                return vars;
            },
            getUrlVar: function (name) {
                return $.getUrlVars()[name];
            }
        });

//封装浏览器参数
        var composeUrlParams = function () {
            var param = '';
            $.each($.getUrlVars(), function (i, item) {
                if (item != 'p') {
                    var val = $.getUrlVar(item);
                    if (val) param += "&" + item + "=" + val;
                }
            });
            return param;
        }

//分页功能
        var options = {
            currentPage: 1,
            <!--currentPage:- page.num >,-->
            totalPages: 2,
            <!--totalPages:- page.pageCount >,-->
            numberOfPages: 5,
            pageUrl: function (type, page, current) {    //页面跳转
                <!--if (page !=- page.num >) {-->
                return '/device/list?num=' + page + '&&sim=ok';
//                    }

            }
        }
    })

    function checkthis($this) {
        var cbox = $($this).find('input');
        cbox.prop("checked") ? cbox.prop('checked', false) : cbox.prop('checked', true);
    }

    function checkAll(name) {
        $("[name=" + name + "]").prop("checked", true);//全选
    }
    function reverseSelect(name) {
        $("[name=" + name + "]").prop("checked", false);
    }

    function updateSim() {
        var imgschk = "";
        $("[name='imgschk']:checked").each(function (i) {
            imgschk += ($(this).val() + ",");
        });
        var simschk = "";
        $("[name='simschk']:checked").each(function (i) {
            simschk += ($(this).val() + ",");
        });
        $.post('/material/updateSim', {
            imgs: imgschk.substring(0, imgschk.length - 1),
            sims: simschk.substring(0, simschk.length - 1)
        }, function (result) {
            if (result.msg) {
                alert('设置成功！');
            } else {
                alert('设置失败！');
            }
        });
    }

    function doRemove() {
        var r = confirm("确定删除此广告吗？");
        if (r == true) {

            var imgschk = "";
            $("[name='imgschk']:checked").each(function (i) {
                imgschk += ($(this).val() + ",");
            });

            $.post('/material/remove', {
                imgs: imgschk.substring(0, imgschk.length - 1)
            }, function (result) {
                if (result.msg) {
                    alert('删除成功！');
                    window.location.reload(true);
                } else {
                    alert('删除失败！');
                }
            });
        }

    }
</script>
<style rel="stylesheet">
    .upload {
        margin-top: -3px;
    }
    .phonenumber{
        margin: 0 10px 5px 0;
    }

    .thumbnail {
        margin: 0 5px 10px 0;
    }
</style>